<template>
  <div>子级</div>
  <button @click="send">给父组件传值</button>
</template>

<script setup lang="ts">

// 给父组件传值 defineEmits
// 方法一：
// const emit = defineEmits(['on-click'], ['on-click'], ['on-click']) // 注册多个触发事件
/* const emit = defineEmits(['on-click'])
const send = () => {
  emit('on-click', '子传父的数据')
} */

// 方法二：
// 可以设置类型和默认值
const emit = defineEmits<{
  (e: "on-click", name: string): void
  // (e: "on-click", name: string): void
  // (e: "on-click", name: string): void
  // (e: "on-click", name: string): void
  // (e: "on-click", name: string): void
}>()

const send = () => {
  emit('on-click', "子传父设置了默认值和类型")
}

// 暴露子组件的属性和方法，方便父组件获取和调用
defineExpose({
  name: "小满",
  open: () => {
    console.log(1)
  }
})

</script>